<script setup>
import {defineProps} from "vue";
import {inject} from "vue";
import {edit} from "../../../apis/brand";
import {plus} from "../../../apis/brand";


/**
 * 自定义属性 ：只读
 * @type {Prettify<Readonly<ExtractPropTypes<{visible: BooleanConstructor}>>>}
 */

const props=defineProps({
  title: String,
  formData:Object

})


const handleImgUploadSuccess1 = (result) =>{
  console.log(result)
  props.formData.image=result.data
  // console.log(props.formData.image)
  setTimeout(() => {
    console.log(props.formData.image);
  }, 10000);

}

// const handleImgUploadSuccess = (result) =>{
//   console.log(result)
//   props.formData.logo=result.data
//   // console.log(props.formData.image)
//   setTimeout(() => {
//     console.log(props.formData.logo);
//   }, 10000);
//
// }
/**
 * 注入父组件中传入的值
 * @type {unknown}
 */
const dialogVisible=inject('dialogVisible')
const isSuccess=inject('isSuccess')

const save = () =>{
  if(props.title == '修改'){
    // console.log(props.formData)
    edit(props.formData).then(()=>{
      dialogVisible.value=false
      isSuccess.value=true
    })
  }else if(props.title == '新增'){
     plus(props.formData).then(()=>{
       dialogVisible.value=false
       isSuccess.value=true
     })
  }

}


</script>


<template>
  <el-dialog :title="props.title" width="500" align-center  v-model="dialogVisible">
    <el-form>
      <el-form-item label="品牌名称">
      <el-input v-model="props.formData.name"/>
    </el-form-item>
      <el-form-item label="品牌英文名">
        <el-input v-model="props.formData.nameen"/>
      </el-form-item>
      <el-form-item label="品牌类型">
        <el-input v-model="props.formData.type"/>
      </el-form-item>
      <el-form-item>
        <!--        http://localhost:8081/files/upload-->
        <el-upload action="http://localhost:8081/files/upload " list-type="picture" :on-success="handleImgUploadSuccess1">
          <el-button>上传品牌图片</el-button>
        </el-upload>
      </el-form-item>
<!--      <el-form-item label="品牌LOGO">-->
<!--        <el-input v-model="props.formData.logo"/>-->
<!--      </el-form-item>-->
<!--      <el-form-item>-->
<!--        &lt;!&ndash;        http://localhost:8081/files/upload&ndash;&gt;-->
<!--        <el-upload action="http://localhost:8081/files/upload " list-type="picture" :on-success="handleImgUploadSuccess">-->
<!--          <el-button>上传品牌LOGO图片</el-button>-->
<!--        </el-upload>-->
<!--      </el-form-item>-->
<!--      <el-form-item label="品牌图片">-->
<!--        <el-input v-model="props.formData.image"/>-->
<!--      </el-form-item>-->


    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="save">
          保存
        </el-button>
      </div>
    </template>
  </el-dialog>


</template>


<style scoped>

</style>